<html>
<body>

<!-- This script uses AJAX to generate the current time and
simulated time. -->
<script type="text/javascript">
function loadTime(){
	$.ajax({
		url: "/outlet_display",
		format: "html",
		success: function(data){
			$("#outlet_display").html(data);
		},
		error: function(jqXHR, textStatus, errorThrown){
		  alert(jqXHR + textStatus + errorThrown);
		}
	});
}
$(function(){
	loadTime();
	
	setInterval(loadTime, 3000); /* Updates every 3 seconds. */
});
</script>
		
<div id="header" id="title">
<p style="font-family: Times New Roman, serif;
		  font-size: 45pt; 
		  padding-top: 17px;"
>
FOB Power Controls
</p>
</div>
<div id="main">
<p id="notice"><%= notice %></p>
<div id="Prefs"> 
<h2>Settings & Status</h2>
<!--Data for this section is taken from the database and
compiled in the outlet_diplay.html file. -->
	<div id="outlet_display"></div>

<br />

</div>

<div id="Prefs" style=" margin-top: 15%;">
<h2>Power Consumption Preference</h2>
<table>
<tr>
<td>
<%= form_for(@user_setting) do |f| %>
<div class="field">
<!-- The user sees the names, but the algorithm uses the numbers,
so this only lets the user see a drop-down list instead of typing
a number. -->
<%= f.select :consumption_preference, 
[['Minimum Consumption', '1'],['Low Consumption','2'],
['Moderate Consumption','3'],['High Consumption','4'],
['Full Consumption','5']]%>
</div>
<div class="actions">
<%= f.submit %>
</div>
</td>
</tr>
<tr>
<td> </td>
</tr>
</table>
<br /></div>



</div>
<div id="footer">
<%= link_to 'Home Page  ', main_path %> |
<%= link_to 'Power Analysis  ', analysis_path %>
</div>

</body>
</html>
<% end %>